<template>
  <basic-container>
    <avue-crud :option="option"
               :table-loading="loading"
               :data="data"
               v-model="form"
               :search.sync="query"
               ref="crud"
               @cell-click="clickCell"
               @on-load="onLoad"
               >
      <template slot="searchMenu">
        <el-button type="success" size="small" icon="el-icon-check" @click="submit11()">提交</el-button>
      </template>
      <template slot="menuLeft">
        <label>审核备注：</label><span>{{remark}}</span>
      </template>
      <template slot="appointAmountHeader" slot-scope="{column}">
        <span style="color: green" v-if="appointAmountEdit">{{column.label}}</span>
        <span style="color: red" v-else>{{column.label}}</span>
      </template>
      <template slot="contractAmountHeader" slot-scope="{column}">
        <span style="color: green" v-if="contractBoxEdit">{{column.label}}</span>
        <span style="color: red" v-else>{{column.label}}</span>
      </template>
      <template slot="buyAmountHeader" slot-scope="{column}">
        <span style="color: green" v-if="actualDeliverEdit">{{column.label}}</span>
        <span style="color: red" v-else>{{column.label}}</span>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
  import {getUpdateList, update} from "@/api/business/batchOrderItem";
  import {getDetail} from "@/api/business/batch";
  import {mapGetters} from "vuex";

  export default {
    created() {
      this.batchOrderId = this.$route.query.batchOrderId;
      this.batchId = this.$route.query.batchId;
      this.remark = this.$route.query.remark;
      this.query = {
        batchName: this.$route.query.batchName,
        instName: this.$route.query.instName,
        companyName: this.$route.query.companyName
      }
    },
    data() {
      return {
        remark: '',
        batchId: '',
        batchOrderId: '',
        form: {},
        query:{},
        loading: false,
        option: {
          emptyBtn: false,
          addBtn: false,
          searchBtn: false,
          refreshBtn: false,
          searchShowBtn: false,
          columnBtn: false,
          height:'auto',
          align:'center',
          calcHeight: 30,
          tip: false,
          searchShow: true,
          searchMenuSpan: 6,
          border: true,
          index: false,
          menu: false,
          dialogClickModal: false,
          column: [
            {
              label: "流水号",
              width: 100,
              prop: "medicineNo",
              type: "input",
              overHidden: true,
            },
            {
              label: "药械名称",
              width: 220,
              prop: "medicineName",
              type: "input",
              overHidden: true,
            },
            {
              label: "剂型",
              prop: "shotType",
              type: "input",
              overHidden: true,
            },
            {
              label: "规格",
              prop: "specification",
              type: "input",
              overHidden: true,
            },
            {
              label: "包装",
              prop: "packages",
              type: "input",
              overHidden: true,
            },
            {
              label: "生产厂家",
              width: 180,
              prop: "produceCompanyName",
              type: "input",
              overHidden: true,
            },
            {
              label: "中选价",
              width: 80,
              prop: "bidPrice",
              type: "input",
            },
            {
              label: "约定量(片/袋/支)",
              width: 120,
              prop: "appointAmount",
              type: 'number',
              precision: 0,
              min: 0,
              controls:false,
              cell: false,
            },
            {
              label: "合同量(片/袋/支)",
              width: 120,
              prop: "contractAmount",
              type: 'number',
              precision: 0,
              min: 0,
              controls:false,
              cell: false,
            },
            {
              label: "实际采购(片/袋/支)",
              width: 140,
              prop: "buyAmount",
              type: 'number',
              precision: 0,
              min: 0,
              controls:false,
              cell: false,
            },
            {
              label: "合同金额",
              width: 100,
              prop: "contractFee",
              type: "input",
            },
            {
              label: "实际采购金额",
              width: 100,
              prop: "buyFee",
              type: "input",
            },
            {
              label: "批次",
              prop: "batchName",
              type: "input",
              searchDisabled: true,
              overHidden: true,
              search: true,
              hide: true
            },
            {
              label: "医院",
              prop: "instName",
              type: "input",
              searchDisabled: true,
              overHidden: true,
              search: true,
              hide: true
            },{
              label: "配送企业",
              prop: "companyName",
              type: "input",
              searchDisabled: true,
              overHidden: true,
              search: true,
              hide: true
            },
          ]
        },
        data: [],
        appointAmountEdit: false,
        contractBoxEdit: false,
        actualDeliverEdit: false,
      };
    },
    computed: {
      ...mapGetters(['tag']),
    },
    methods: {
      handleCloseTag(path) {
        this.$store.commit('DEL_TAG', this.tag);
        if (path) this.$router.push(path)
      },
      clickCell(row, column, cell, event) {
        switch (column.columnKey) {
          case 'buyAmount':
            if (this.actualDeliverEdit) {
              this.findObject(this.option.column, "buyAmount").cell = true;
            }
            break;
          case 'appointAmount':
            if (this.appointAmountEdit) {
              this.findObject(this.option.column, "appointAmount").cell = true;
            }
            break;
          case 'contractAmount':
            if (this.contractBoxEdit) {
              this.findObject(this.option.column, "contractAmount").cell = true;
            }
            break;
          default:
            break;
        }
      },
      resetColumn() {
        this.findObject(this.option.column, "buyAmount").cell = false;
        this.findObject(this.option.column, "appointAmount").cell = false;
        this.findObject(this.option.column, "contractAmount").cell = false;
        this.appointAmountEdit = false;
        this.contractBoxEdit = false;
        this.actualDeliverEdit = false;
      },
      onLoad() {
        console.log("onload",this.batchOrderId,this.batchId);
        if (this.batchOrderId === undefined || this.batchOrderId === '') {
          this.$message({
            type: "error",
            message: "未获取到当前工单信息。"
          });
          this.handleCloseTag('/business/batchOrder');
          return;
        }
        if (this.batchId === undefined || this.batchId === '') {
          this.$message({
            type: "error",
            message: "未获取到工单批次"
          });
          this.handleCloseTag('/business/batchOrder');
          return;
        }
        //重置可编辑列
        this.resetColumn();
        this.loading = true;

        getDetail(this.batchId).then(res => {
          const batchData = res.data.data;
          let now = new Date().getTime();
          let date1 = new Date(batchData.appointAmountStart).getTime();
          let date2 = new Date(batchData.appointAmountEnd).getTime();
          //可编辑并显绿色
          if (date1 <= now && now <= date2) {
            this.appointAmountEdit = true;
          }
          let date3 = new Date(batchData.contractBoxStart).getTime();
          let date4 = new Date(batchData.contractBoxEnd).getTime();
          if (date3 <= now && now <= date4) {
            this.contractBoxEdit = true;
          }
          let date5 = new Date(batchData.actualDeliverStart).getTime();
          let date6 = new Date(batchData.actualDeliverEnd).getTime();
          if (date5 <= now && now <= date6) {
            this.actualDeliverEdit = true;
          }
        });

        let param = {
          batchOrderId: this.batchOrderId
        };
        getUpdateList(param).then(res => {
          const data = res.data.data;
          data.forEach((item) => {
            item.$cellEdit = true
          });
          this.data = data;
          this.loading = false;
        });
      },
      submit11() {
        if (this.data.length === 0) {
          this.$message({
            type: "error",
            message: "待提交数据为空。"
          });
        } else if (this.appointAmountEdit === false && this.contractBoxEdit === false  && this.actualDeliverEdit === false) {
          this.$message({
            type: "error",
            message: "该批次字段在当前时间不可编辑，无法提交。"
          });
        } else {
          let param = {
            batchOrderId: this.batchOrderId,
            itemList: this.data
          };
          this.loading = true;
          update(param).then( res => {
            if (res.data.success) {
              this.$message({
                type: "success",
                message: res.data.msg
              });
              //this.onLoad();
              this.handleCloseTag('/business/batchOrder');
            } else {
              this.$message({
                type: "error",
                message: res.data.msg
              });
            }
            this.loading = false;
            done();
          }, error => {
            done();
            console.log(error);
          });
        }
      }
    }
  };
</script>

<style>
</style>
